<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
		<link href="resources/css/mui.min.css" rel="stylesheet" />
		<link href="resources/css/common1.css" rel="stylesheet" />
		<link href="resources/css/swiper.css" rel="stylesheet" />
		<script src="resources/js/swiper.js"></script>
		<script src="resources/js/jquery-1.10.1.min.js"></script>
		<script src="resources/js/WebViewJavascriptBridge.js"></script>
		<script src="resources/js/common.js"></script>
		<script src="resources/js/mui.min.js"></script>
		<script src="resources/js/vue.min.js"></script>
		<title>超贷</title>
		<style>
			body, html{background-color: #FFFFFF;}
			#header{background-color: #2487ff; color: #FFFFFF;}
			a, a:active, .mui-title,.mui-bar .mui-btn-link{ color: #FFFFFF;}
			.titBox{ background: #2487ff;}
			.titBox ul{background: #2487ff; padding: 10px 10px 10px 0px;}
			.newTit2 span{font-size: 12px; border-radius: 10px; border:1px solid #EEEEEE; color: #FFF; padding: 2px 3px; margin-right: 15px;}
			.newTit{margin-right: 15px; font-size: 12px; margin-top: 1px;}
			.newImg{border-radius: 3px;}
			.mui-content>.mui-table-view:first-child{margin-top: 0px;}
			.listBox{background-color: #FFFFFF; height: 250px;  padding: 10px;}
			.listBox div{border-bottom: 1px solid #EFEFEF; height: 45px; line-height: 45px;}
			.listD{text-align: right;}
			.listD input,.listD select, .mobileBox{width: 70%; margin-left:30%; height: 98%;     padding-left: 15px;text-align: left;text-align-last: left; font-size: 12px; border: 0px;}
			
			.footerBtn{width: 100%; height: 40px; line-height: 40px; background-color: #2487ff; color: #FFFFFF; text-align: center; position: fixed; bottom: 0px;}
			.mui-bar .mui-btn-link.mui-active, .mui-bar .mui-btn-link:active {    color: #ffff;}
			.mui-btn-blue.mui-active:enabled, .mui-btn-blue:enabled:active, .mui-btn-primary.mui-active:enabled, .mui-btn-primary:enabled:active, input[type=submit].mui-active:enabled, input[type=submit]:enabled:active{border:0px;}
		</style>
	</head>

	<body>
	<div id="app">
		<header id="header" class="mui-bar mui-bar-nav">
			<a id="toBack1"  href="javascript:;" onclick="closePage();"  class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left colorf"></a>
			<h1 class="mui-title">个人资料</h1>
			<button class="mui-btn mui-btn-blue mui-btn-link mui-pull-right" @click="subInfo()">确定</button>
		</header>
		
		<div class="mui-content">
			<div  class="mui-row listBox" >
		        <div class="mui-col-sm-6 mui-col-xs-6 listTit color3">
		        	昵称
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listD color4">
		        	<input type="text" id="userName" v-model="searchList.nickName" placeholder="请输入昵称">
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listTit color3">
		        	手机号
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listD color4">
		        	<div class="mobileBox">{{searchList.mobile}}</div>
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listTit color3">
		        	教育程度
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listD color4">
		        	<select v-model="searchList.educational" id="educationBox">
			            <option v-for="education in educationList" :value="education">
			                {{education}}
			            </option>
			        </select> 
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listTit color3">
		        	职业类别
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listD color4">
		        	<select v-model="searchList.job"  id="jobBox">
			            <option v-for="job in jobList" :value="job">
			                {{job}}
			            </option>
			        </select> 
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listTit color3">
		        	薪资收入
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-6 listD color4">
		        	<select  v-model="searchList.salary"  id="salaryBox">
			            <option v-for="salary in salaryList" :value="salary">
			                {{salary}}
			            </option>
		        	</select>
		        </div>
			</div>
		</div>
		<!--footer-->
		<!--<div class="mui-row tabBarBox" >
			<li class="active fontS14" onclick="tabBar1()">
                <img src="resources/images/tab-bar11.png"> <br> 首页
	        </li>
  	        <li class="fontS14" onclick="tabBar2()">
                <img src="resources/images/tab-bar2.png"> <br>贷款
	        </li>
	        <li class="fontS14" onclick="tabBar3()">
	            <img src="resources/images/tab-bar3.png">  <br>社区
	        </li>
			<li class="fontS14" onclick="tabBar4()">
                <img src="resources/images/tab-bar4.png"> <br>我的
			</li>
		</div>
		<div class="tabBarBottom"></div>
			-->
			
		<!--<div class="footerBtn">立即申请</div>-->	
	</div>	
	
	<script>
		var body= "";
	 	var model ="";
	 	var jdata="";	
	 	var uid = window.localStorage.uid;
	 	var token = window.localStorage.token;
	 	
	 	var userName = "";
	 	var educationBox = "";   //教育程度
	 	var jobBox = "";    //职业类别
	 	var salaryBox ="";    //薪资收入
		//调接口必传 格式
		 var header={
	     	app_version:'1.1.1',
	     	app_model:'ios',
	     	token:token,
	     	uid:uid 
	     }
	 	
	 	
		var vm = new Vue({
			el : '#app',
			data : {
				searchList:{},
				educationList:["请选择","初中","高中","大专","本科","研究生","博士"],
				jobList:["请选择","金融","教育","医疗","电商","游戏","房产","汽车","软件","实业","装修建材","生活服务","商务服务","其他"],
				salaryList:["请选择","3000以下","3000-5000","5000-8000","8000-10000","10000-15000","15000-20000","20000以上"]
			},
			created : function() {
				this.init();
			},
			methods : {
				init : function(){
					body={
							'id':uid 
					    }
					model={
				    	body:body,
				    	header:header,
				    }
				    jdata=JSON.stringify(model);
					var that=this;
					$.ajax({
						url: 'appUser/myInfo',
						method: 'post',
						data:{
							'data':jdata
						},
						success: function(data){
							var json=JSON.parse(data);
							that.searchList = json.data; 
							if(json.code !="1001"){
								if(that.searchList.educational==""){
									that.searchList.educational="请选择"
								};
								if(that.searchList.job==""){
									that.searchList.job="请选择"
								};
								if(that.searchList.salary==""){
									that.searchList.salary="请选择"
								};
							}else{
								mui.toast("登录异常");
								window.localStorage.clear();
								location.href="userInfo.html"
							}
							
						},
						error: function(){
							/* alert("数据加载异常!"); */
						}
					});
				},
		        subInfo: function(){
		        	var that=this;
		        	body={
							'id':uid,
							'nickName':that.searchList.nickName,
							'educational':that.searchList.educational,
							'job':that.searchList.job,
							'salary':that.searchList.salary
					    }
					model={
				    	body:body,
				    	header:header,
				    }
				    jdata=JSON.stringify(model);
		        	var that=this;
					$.ajax({
						url: 'appUser/changeProfile',
						method: 'post',
						data:{
							'data':jdata
						},
						success: function(data){
							var json=JSON.parse(data);
							if(json.code=="0"){
								mui.toast("修改成功");
								setTimeout(function(){
									location.href="index.html"
								}, 2000); 
								
							}else{
								mui.toast(json.msg);
							}
						},
						error: function(){
							/* alert("数据加载异常!"); */
						}
					});
		        }
			},
			filters : {
				
			}
		})
	</script>
	</body>

</html>